<template>
    <div class="form-layout">
    <!--左侧导航-->
    <div class="nav-left">
      <customAnchor
        :itemList="[
          { name: 'box-base', title: '共享设置' },
          { name: 'box-dtl', title: '可选设备' },
        ]"
      />
    </div>
    <!--表单区域-->
    <div class="form-right" ref="formRight">
      <customForm :data="form" :rules="propRules" ref="editForm" :disabled="propReadonly">
        <template #content>
          <template v-if="cpIsShare">
            <div id="box-base" class="box-title">共享设置</div>

            <customFormItem label="租赁分类"name="circulateClassify" :parent="_self" :form="form"
                            :type="constCommon.formItemType.selectDict.name"
                            :config="{dictType: constCommon.dictType.deviceCirculateClassify}"
            />

            <customFormItem label="结算方式"name="costClassify" :parent="_self" :form="form"
                            :type="constCommon.formItemType.selectDict.name"
                            :config="{dictType: constCommon.dictType.deviceCirculateCostClassify}"
            />

            <customFormItem label="单次费用(元)" name="costPrice" :parent="_self" :form="form"
                            :type="constCommon.formItemType.inputNumber.name"
                            help="根据结算方式来，每天费用、每日费用、每小时费用"
            />
          </template>
        </template>
      </customForm>

      <div id="box-dtl" class="box-title">可选设备<small style="font-size: 11px; color: red; margin-left: 5px;">闲置中、尚未进行设置的设备</small></div>
      <data-view ref= "childDataView"
                 propViewKey="device_ledger_select"
                 :propAutoFetchData="false"
                 class="data-view-inlinebtn"
                 propViewForm="device/device_ledger/device_ledger_detail.vue"
                 :propIsTdesign="true"
                 :propOnlyQueryAll="true"
                 :propUserParam="{busType: cpSetType}"
                 :propHideColumns="['deviceStatus', 'flagLock']"
      />
    </div>
  </div>
</template>

<script>
import customAnchor from '@/components/custom/form/customAnchor.vue'

export default {
  desc: '设备共享设置-详情',
  data() {
    return {
      form: {},
    }
  },
  computed: {
    // 业务类型
    cpSetType() {
      return this.propParam && this.propParam.setType ? this.propParam.setType : '-1'
    },
    // 是否共享设置
    cpIsShare() {
      return this.cpSetType == this.constCommon.deviceSetType.share
    },
    // 是否共享设置
    cpItemList() {
      if (this.cpIsShare) {
        return [
          { name: 'box-base', title: '共享设置' },
          { name: 'box-dtl', title: '可选设备' },
        ]
      }
      return [
        { name: 'box-dtl', title: '可选设备' },
      ]
    }
  },
  created() {
    this.$emit('event-register', {
      //表单校验
      validate: (callback) => {
        return this.$refs.editForm.validate(callback)
      },

      //保存前操作
      beforeSave: () => {
        this.$emit('data-callback', this.form)
        let checks = this.$refs.childDataView.getGrid().getCheckboxRecords()
        if (checks.length == 0) {
          this.utilMessage.warning('请选择设备')
          return false
        }
        this.saveBatch(checks)
        return false
      },

      //数据加载后
      afterMove: (formData, initData) => {
        this.form = global.utils.jsonClone(formData)
        this.loadDtl()
      },

      //数据保存后
      afterSave: () => {
      },
      beforeDelete: () => {
        return true
      },

      //数据删除后
      afterDelete: () => {
      },

      //流程提交前
      beforeFlow: (flowButtonKey) => {
        return true
      },

      //流程提交后
      afterFlow: (flowButtonKey) => {
      },

      //表单关闭前
      beforeClose: () => {
        return true
      }
    })
  },
  props: {
    //上级对象
    propParent: Object,
    //上级初始化数据
    propInitData: Object,
    //主键字段
    propPrimaryKey: String,
    //数据字典
    propDictionaries: Object,
    //当前操作行
    propCurrentRow: Object,
    //表单数据
    propViewFormData: Object,
    //是否只读
    propReadonly: Boolean,
    //操作状态
    propStatus: String,
    //表单规则
    propRules: Object,
    //表单规则
    propParam: Object
  },
  components: {
    customAnchor
  },
  methods: {
    // 加载明细
    loadDtl() {
      let queryWrapper = this.$newWrapper()
      this.$refs.childDataView.setQueryWrapper(queryWrapper)
    },

    // 保存
    saveBatch(rows) {
      let that = this
      this.utilMessage.confirm('是否添加所选设备', () => {
        //转换属性
        rows.forEach(ob => {
          ob.ledgerId = ob.id
          ob.belongDeptId = ob.deptIdOwner
          ob.belongDeptName = ob.deptNameOwner
          ob.id = null
          ob.setType = this.cpSetType
          Object.keys(that.form).forEach(key => {
            ob[key] = that.form[key]
          })
        })

        //批量添加
        this.utilVue.loadShow(true)
        this.$ajax.post('/device/circulate_settings/saveBatch', rows).then(resp => {
          this.utilVue.loadHide()
          if (resp.code == 0) {
            this.utilMessage.success(resp.msg)
            this.loadDtl()
          }
        })
      })
    }
  }
}
</script>
